<template>
	<view>
		<!-- <u-navbar title="店铺中心" :is-back="false"></u-navbar> -->
		<view class="top u-flex u-flex-col u-row-between">
			<view class="u-flex u-row-between" style="width: 100%;">
				<view class="u-flex u-row-between">
					<image :src="avatar?avatar:'../../static/logo.png'" class="avatar"></image>
					<view>
						<view class="top_tit">{{shopname}}</view>
						<view class="top_tel">电话：{{mobile}}</view>
					</view>
				</view>
				<view class="u-flex" @click="goMine()">
					<image src="@/static/index/qiehuan.png" mode="" class="qhimg"></image>
					<view class="text-ff text-26">切换用户端</view>
				</view>
				<image src="@/static/wImg/edit.png" class="top_edit" @click="$func.jump('/wNew/pages/set')"></image>
			</view>
			<view class="top_yel" @click="$func.jump('/yCreate/pages/earnings')">
				<view class="u-flex u-row-between" style="width: 100%;">
					<view class="u-flex">
						<image class="top_mark" src="../../static/wImg/treetop.png"></image>
						<text style="color: #222;font-size: 28rpx;font-weight: bold;">收益中心</text>
					</view>
					<view class="u-flex">
						<text style="color: #222;font-size: 24rpx;">点击进入</text>
						<image src="../../static/wImg/arrowRig.png" class="top_right"></image>
					</view>
				</view>
			</view>
		</view>
		<view style="padding: 0 30rpx;">
			<view class="info">
				<image src="../../static/wImg/location.png"></image>
				<view>
					<view class="in_tit">联系人：{{sendName}}</view>
					<view class="in_add">{{sendAddr}}</view>
				</view>
			</view>
			<!-- <view class="info">
				<image src="../../static/wImg/greHome.png"></image>
				<view style="flex: 1;">
					<view class="in_tit">商家简介</view>
					<view class="in_add">{{bio}}</view>
				</view>
			</view> -->
		</view>
		<view class="padding-30 bg-ff radius-10 margin-30" v-if="shop_type==1">
			<view class="flex align-center">
				<image src="../../static/yCreate/dt.png" mode="" class="dtimg"></image>
				<view class="flex-one text-30 text-bold margin-lr-30">商家动态</view>
				<view class="fbbtn" @tap.stop="toAddDynamic(1)">发布动态</view>
			</view>
			<view class="padding-top-30 padding-bottom-45 border-bottom-ed flex align-center"
				v-for="(item,index) in trendslist" :key="index">
				<image :src="item.cover" mode="" class="trendsimg radius-10"></image>
				<view class="flex-one margin-left-30">
					<view class="text-28 text-cut-one">{{item.title}}</view>
					<view class="flex align-end margin-top-30">
						<view class="text-24 text-b9 text-cut-one flex-one">{{item.create_time_text}}</view>
						<view class="bjbtn" @click="goBj(item.id)">
							编辑
						</view>
						<view class="delbtn" @click="getDel(item.id)">
							删除
						</view>
					</view>
				</view>
			</view>
		</view>
		<uni-popup ref="show_item" type="bottom">
			<view class="show-popup pd-lg">
				<view @tap.stop="toAddDynamic(1)" class="show-item flex-center f-paragraph mt-md radius-16">发布图片
				</view>
				<view @tap.stop="toAddDynamic(2)" class="show-item flex-center f-paragraph mt-md radius-16">发布视频
				</view>
				<view @tap.stop="$refs.show_item.close()" class="show-item flex-center f-paragraph mt-md radius-16"
					:style="{color:primaryColor}">取消</view>
				<view class="space-safe"></view>
			</view>
		</uni-popup>
		<u-tabbar v-model="current" @change="changeTab" height="55px" active-color="#606DCE" inactive-color="#888"
			:list="tabList"></u-tabbar>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				tabList: [{
						iconPath: "https://apishop.qiancdj.com/static/img/home.png",
						selectedIconPath: "https://apishop.qiancdj.com/img/tabber/home.png",
						text: '商品',
					},
					{
						iconPath: "https://apishop.qiancdj.com/static/img/order.png",
						selectedIconPath: "https://apishop.qiancdj.com/img/tabber/category.png",
						text: '订单',
					},
					{
						iconPath: "https://apishop.qiancdj.com/static/img/shen.png",
						selectedIconPath: "https://apishop.qiancdj.com/img/tabber/sh.png",
						text: '审核',
					},
					{
						iconPath: "https://apishop.qiancdj.com/static/img/cart.png",
						selectedIconPath: "https://apishop.qiancdj.com/img/tabber/card.png",
						text: '运费',
					},
					{
						iconPath: "https://apishop.qiancdj.com/static/img/mine.png",
						selectedIconPath: "https://apishop.qiancdj.com/img/tabber/user.png",
						text: '我的',
					},
				],
				current: 4,
				avatar: "",
				shopname: "",
				mobile: "",
				sendName: "",
				sendAddr: "",
				bio: "",
				trendslist: [],
				shop_type: ""
			}
		},
		mounted() {
			var a = document.getElementsByClassName('uni-page-head-hd')[0]
			a.style.display = 'none';
		},
		onReady() {
			this.shop_type = uni.getStorageSync('shop_type')
			if (uni.getStorageSync('shop_type') == 2) {
				var list = [{
						iconPath: "https://apishop.qiancdj.com/static/img/home.png",
						selectedIconPath: "https://apishop.qiancdj.com/img/tabber/home.png",
						text: '商品',
					},
					{
						iconPath: "https://apishop.qiancdj.com/static/img/order.png",
						selectedIconPath: "https://apishop.qiancdj.com/img/tabber/category.png",
						text: '订单',
					},
					{
						iconPath: "https://apishop.qiancdj.com/static/img/mine.png",
						selectedIconPath: "https://apishop.qiancdj.com/img/tabber/user.png",
						text: '我的',
					},
				]
				this.tabList = list
			}
			this.$u.post('/api/shop/shop_details', {}).then(res => {
				if (res.code == 1) {
					this.avatar = res.data.avatar
					this.shopname = res.data.shopname
					this.mobile = res.data.mobile
					this.sendName = res.data.sendName
					this.sendAddr = res.data.sendAddr
					this.bio = res.data.bio
				}
			})
			this.getList()
		},
		onShow() {
			this.getList()
		},
		methods: {
			getList() {
				uni.request({
					url: 'https://api.qiancdj.com/index.php?i=666&m=longbing_massages_city&s=dynamic/app/IndexDynamicCoach/dynamicList&urls=dynamic/app/IndexDynamicCoach/dynamicList',
					data: {
						shop_id: uni.getStorageSync('shop_id')
					},
					header: {
						'autograph': uni.getStorageSync('autograph'),
					},
					success: (res) => {
						console.log(res, 'res')
						this.trendslist = res.data.data.data
					}
				})
			},
			changeTab(e) {
				if (uni.getStorageSync('shop_type') == 1) {
					if (e == 0) {
						this.$func.jump('/yCreate/pages/goodsManagement')
					} else if (e == 1) {
						this.$func.jump('/yCreate/pages/orderManagement')
					} else if (e == 2) {
						this.$func.jump('/yCreate/pages/reviewOrder')
					} else if (e == 3) {
						this.$func.jump('/wNew/pages/freight')
					}
				} else if (uni.getStorageSync('shop_type') == 2) {
					if (e == 0) {
						this.$func.jump('/yCreate/pages/goodsManagement')
					}else if (e == 1) {
						this.$func.jump('/yCreate/pages/orderManagement')
					}
				}
			},
			toAddDynamic(type) {
				this.$refs.show_item.close()
				this.$util.goUrl({
					url: `/wNew/pages/release?type=${type}`
				})
			},
			getDel(id) {
				uni.request({
					url: 'https://api.qiancdj.com/index.php?i=666&m=longbing_massages_city&s=dynamic/app/IndexDynamicCoach/delDynamic&urls=dynamic/app/IndexDynamicCoach/delDynamic',
					data: {
						id: id,
						shop_id: uni.getStorageSync('shop_id')
					},
					header: {
						'autograph': uni.getStorageSync('autograph'),
					},
					success: (res) => {
						var that = this
						uni.request({
							url: 'https://api.qiancdj.com/index.php?i=666&m=longbing_massages_city&s=dynamic/app/IndexDynamicCoach/dynamicList&urls=dynamic/app/IndexDynamicCoach/dynamicList',
							data: {
								shop_id: uni.getStorageSync('shop_id')
							},
							header: {
								'autograph': uni.getStorageSync('autograph'),
							},
							success: (res) => {
								console.log(res, 'res')
								that.trendslist = res.data.data.data
								console.log(that.trendslist, 'res')
							}
						})
					}
				})
				// return false
				// uni.showModal({
				// 	content: '是否确认删除动态',
				// 	success: function(res) {
				// 		if (res.confirm) {

				// 		} else if (res.cancel) {
				// 			console.log('用户点击取消');
				// 		}
				// 	}
				// })
			},
			goBj(id) {
				this.$util.goUrl({
					url: `/wNew/pages/release?id=${id}&type=1`
				})
			},
			goMine() {
				uni.reLaunch({
					url: '/subPages/technician/tabBar/mine'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import url(@/components/common.css);

	.top {
		width: 100%;
		height: 292rpx;
		padding: 32rpx 30rpx 0;
		background: linear-gradient(135deg, #606DCE 0%, #606DCE 100%);

		.avatar {
			width: 120rpx;
			height: 120rpx;
			border-radius: 50%;
			margin-right: 20rpx;
		}

		.top_tit {
			font-size: 32rpx;
			font-weight: bold;
			color: #FFF;
		}

		.top_tel {
			font-size: 28rpx;
			color: #FFF;
			margin-top: 12rpx;
		}

		.top_edit {
			width: 36rpx;
			height: 36rpx;
		}

		.top_yel {
			width: 100%;
			height: 90rpx;
			line-height: 90rpx;
			background: #f2ddaf;
			padding: 0 30rpx;
			border-radius: 20rpx 20rpx 0 0;
			display: flex;
			align-items: center;

			.top_mark {
				width: 32rpx;
				height: 36rpx;
				margin-right: 20rpx;
			}

			.top_right {
				width: 12rpx;
				height: 24rpx;
				margin-left: 10rpx;
			}
		}
	}

	.info {
		background: #FFFFFF;
		border-radius: 10rpx;
		padding: 30rpx;
		margin-top: 30rpx;
		display: flex;

		image {
			width: 43rpx;
			height: 40rpx;
			margin-top: 41rpx;
			margin-right: 31rpx;
		}

		.in_tit {
			font-size: 32rpx;
			font-weight: bold;
			color: #333;
		}

		.in_add {
			font-size: 24rpx;
			color: #333;
			margin-top: 10rpx;
		}
	}

	.dtimg {
		width: 40rpx;
		height: 40rpx;
	}

	.fbbtn {
		width: 132rpx;
		height: 38rpx;
		background: #27B082;
		border-radius: 19rpx 19rpx 19rpx 19rpx;
		font-size: 24rpx;
		color: #FFFFFF;
		line-height: 38rpx;
		text-align: center;
	}

	.show-popup {
		width: 750rpx;
		background: #F3F3F5;
		border-radius: 30rpx 30rpx 0 0;

		.avatar {
			width: 84rpx;
			height: 84rpx;
		}

		.show-item {
			color: #222;
			height: 100rpx;
			background: #fff;
		}
	}

	.trendsimg {
		width: 116rpx;
		height: 116rpx;
	}

	.align-end {
		align-items: flex-end;
	}

	.text-b9 {
		color: #b9b9b9;
	}

	.bjbtn {
		width: 109rpx;
		height: 38rpx;
		border-radius: 19rpx 19rpx 19rpx 19rpx;
		border: 1rpx solid #C6C6C6;
		font-size: 24rpx;
		color: #B4B4B4;
		line-height: 38rpx;
		text-align: center;
	}

	.delbtn {
		width: 109rpx;
		height: 38rpx;
		background: #27B082;
		border-radius: 19rpx 19rpx 19rpx 19rpx;
		font-size: 24rpx;
		color: #FFFFFF;
		line-height: 38rpx;
		text-align: center;
		margin-left: 10rpx;
	}

	.qhimg {
		width: 22rpx;
		height: 22rpx;
		margin-right: 10rpx;
	}
</style>